<template>
  <div class="bgc">
    <div class="box">
      <h3>用户注册</h3>
      <div class="reForm">
        <el-form :model="registerForm" ref="registerForm" label-width="120px">
          <el-form-item prop="userName" label="账号" size="mini" style="width:300px;height:40px;">
            <el-input v-model="registerForm.userName" placeholder="账号" ></el-input>
          </el-form-item>
          <el-form-item prop="password" label="密码" size="mini" style="width:300px;height:40px;">
            <el-input v-model="registerForm.password" placeholder="密码" ></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer">
          <el-button size="mini" type="primary" @click="registerGo" style="background-color:#409eff;margin-left:170px">注册</el-button>
        </span>
      </div>
    </div>
  </div>
</template>
<script>
import {mixin} from '../mixins/index'
export default {
  mixins: [mixin],
  data() {
    return {
      registerForm: {
        userName: "",
        password: "",
      }
    }
  }

};
</script>
<style scoped>
h3 {
  text-align: center;
  margin-top: 10px;
  font-size: 24px;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
.bgc {
  position: relative;
  background: url("../assets/img/background.jpg");
  width: 100%;
  height: 100%;
}
.box {
  position: absolute;
  width: 400px;
  height: 210px;
  background-color: #fff;
  margin: 250px 0 0 620px;
  border-radius: 10px;
}
.reForm {
  margin-top: 10px;
  width: 400px;
  height: 110px;

}
</style>
